<template>
	<div class="notice">
		<strong>公告：</strong>
		
		<span v-for="notice in notices">
			<time>{{"[ "+notice.time+" ]"}}</time>
			<a v-link="{path: notice.path}">{{notice.name}}</a>
		</span>
		<span>
			<a v-link="{path: '/home'}">更多&gt;&gt;</a>
		</span>
	</div>
</template>
<script>
    export default {
        data () {
            return {
                notices: [
                    {
                        name: '华东1地域部分负载均衡https访问异常通报',
                        path:'/home',
                        time:'2.9'
                    },
                    {
                        name: '华东1地域部分负载均衡https访问异常通报',
                        path:'/home',
                        time:'2.9'
                    },
                ]
            };
        }
    }
</script>
<style>
	.notice{
        line-height:40px; background: #fff;
        width:100%;
        box-sizing: border-box;
        padding:0px 20px;
        box-shadow: 0px 2px 2px 2px #dee1e4;
    }
    .notice span{
    	display: inline-block;
    	margin-right: 1em;
    }
    .notice span time{
    	color: #9ea7b4;
    }
    .notice span a:hover{
		text-decoration: underline;
    }
</style>